package com.wake.mycomposebook.ui.home.layouts.advlist

import androidx.compose.foundation.Image
import androidx.compose.foundation.border
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
import androidx.compose.material.Icon
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Text
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Favorite
import androidx.compose.material.icons.filled.Menu
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.text.style.TextOverflow
import androidx.compose.ui.unit.dp
import androidx.constraintlayout.compose.ConstraintLayout
import androidx.constraintlayout.compose.Dimension
import com.wake.data.AlbumsDataProvider
import com.wake.data.model.Album

/**
 *@author created by WA03675
 *@date  2022-04-19 16:34
 *@des
 */

@Composable
fun SwipeableList() {

    MySwipeableList()
}

@Composable
fun MySwipeableList() {
    val albums = AlbumsDataProvider.albums

    LazyColumn {
        items(albums, key = { item -> return@items item.id }) {
            MySwipeableItem(it)
        }
    }
}

@Composable
fun MySwipeableItem(item: Album) {
    ConstraintLayout(
        modifier = Modifier
            .fillMaxWidth()
            .height(100.dp)
            .border(1.dp, Color.Red)
    ) {
        val (img, title, subContent, like, menu) = createRefs()
        Image(painter = painterResource(id = item.imageId), contentDescription = null,
            Modifier
                .height(60.dp)
                .width(60.dp)
                .constrainAs(img) {
                    absoluteLeft.linkTo(parent.start)
                    linkTo(top = parent.top, bottom = parent.bottom)
                }
        )
        Text(
            text = item.song,
            style = MaterialTheme.typography.h5,
            modifier = Modifier
                .padding(16.dp, 0.dp, 0.dp, 0.dp)
                .constrainAs(title) {
                    linkTo(
                        top = parent.top, bottom = subContent.top,
                        start = img.end, end = like.start
                    )
                    width = Dimension.fillToConstraints
                },
            maxLines = 1,
            overflow = TextOverflow.Ellipsis
        )
        Text(
            text = item.artist,
            style = androidx.compose.material3.MaterialTheme.typography.bodyMedium,
            modifier = Modifier.constrainAs(subContent) {
                linkTo(
                    top = title.bottom, bottom = parent.bottom,
                    start = title.start, end = like.start
                )
                width = Dimension.fillToConstraints
            },
            maxLines = 1,
            overflow = TextOverflow.Ellipsis
        )

        Icon(
            imageVector = Icons.Default.Favorite,
            contentDescription = null,
            Modifier
                .width(20.dp)
                .constrainAs(like) {
                    linkTo(
                        start = subContent.end,
                        end = menu.start,
                        top = parent.top,
                        bottom = parent.bottom
                    )
                }
        )

        Icon(
            imageVector = Icons.Default.Menu,
            contentDescription = null,
            Modifier
                .width(20.dp)
                .constrainAs(menu) {
                    linkTo(
                        start = like.end,
                        end = parent.end,
                        top = parent.top,
                        bottom = parent.bottom
                    )
                }

        )


    }
}
